/*
 * Copyright © 2015 Cask Data, Inc.
 *
 * Licensed under the Apache License, Version 2.0 (the "License"); you may not
 * use this file except in compliance with the License. You may obtain a copy of
 * the License at
 *
 * http://www.apache.org/licenses/LICENSE-2.0
 *
 * Unless required by applicable law or agreed to in writing, software
 * distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
 * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
 * License for the specific language governing permissions and limitations under
 * the License.
 */

//
// Mixins
// --------------------------------------------------

.border-radius (@radius) {
  -webkit-border-radius: @radius;
  -moz-border-radius:    @radius;
  border-radius:         @radius;

  -moz-background-clip:    padding;
  -webkit-background-clip: padding-box;
  background-clip:         padding-box;
}

.cask-btn(@background: white, @border: 1px solid #CCC, @border-radius: 4px, @color: @btn-default-color, @font-size: 14px, @padding: 6px 24px) {
  background: @background;
  border: @border;
  .border-radius(@border-radius);
  color: @color;
  font-size: @font-size;
  outline: none;
  padding: @padding;
  white-space: normal;
  &:hover, &:focus { text-decoration: none; }
}

.dropdown-defaults(@text-align: right) {
  + .dropdown-menu {
    background-color: transparent;
    border: 0;
    margin: 0;
    padding: 0;
    max-height: 500px;
    overflow-y: auto;
    > li {
      > a {
        padding: 10px;
        cursor: pointer;
      }
      span.fa {
        margin-top: 3px;
        margin-right: 0;
        text-align: @text-align;
      }
    }
  }
}

.dropdown-left() {
  .btn.dropdown-toggle {
    .border-radius(4px);
    + .dropdown-menu {
      .border-radius(0);
      > li:first-child a { .border-radius(0); }
      > li:last-child a, > li:only-child a { .border-radius(0 0 4px 4px); }
    }
  }
  &.open {
    .btn.dropdown-toggle {
      .border-radius(4px 4px 4px 0);
      + .dropdown-menu { .border-radius(0); }
    }
  }
}

.dropdown-right() {
  .btn.dropdown-toggle {
    .border-radius(4px);
    + .dropdown-menu {
      .border-radius(0);
      > li:first-child a { .border-radius(4px 0 0 0); }
      > li:last-child a { .border-radius(0 0 4px 4px); }
      > li:only-child a { .border-radius(4px 0 4px 4px); }
    }
  }
  &.open {
    .btn.dropdown-toggle { .border-radius(4px 4px 0 0); }
  }
}

.dropdown-blue() {
  + .dropdown-menu {
    > li {
      > a {
        background-color: @cdap-header;
        color: white;
        &:hover, &:focus {
          background-color: white;
          color: @cdap-header;
        }
      }
    }
  }
}

.dropdown-white() {
  + .dropdown-menu {
    > li {
      > a {
        background-color: #ffffff;
        color: #6a7387;
        &:hover, &:focus {
          background-color: @cdap-header;
          color: white;
        }
      }
    }
  }
}

.navbar-collapse-menus() {
  // for li.dropdown instances in global navbar
  min-width: 100px;
  a.dropdown-toggle {
    padding-bottom: 0;
    span.caret {
      .transition (all 0.2s ease-in);
    }
  }
  ul.dropdown-menu.am-flip-x {
    .transition(none);
    -webkit-animation-duration: 0s;
    animation-duration: 0s;
  }
  li.disabled { display: none; }
  &.open {
    a.dropdown-toggle {
      background-color: transparent;
      text-align: left;
      .transition(all 0.1s ease);
      &:hover, &:focus { background-color: transparent; }
      .caret {
        .rotate(-90deg);
      }
    }
    ul.dropdown-menu { padding: 0; }
  }
}

.flexbox() {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
}

.order(@val) {
  -webkit-box-ordinal-group: @val;
  -moz-box-ordinal-group: @val;
  -ms-flex-order: @val;
  -webkit-order: @val;
  -webkit-box-ordinal-group: @val;
  order: @val;
}

.appearance(@value: none) {
  // Remove dashed border from select elements when in focus
  text-shadow: 0 0 0 @cdap-header;

  appearance: @value;
  -webkit-appearance: @value;
  -moz-appearance: @value;
  -o-appearance: @value;
  ::-ms-expand {
    display: none;  // Need this to hide default select in IE10
  }
}

.placeholder-color(@color: white, @font-weight: 500) {
  &::-webkit-input-placeholder {
    color: @color;
    font-weight: @font-weight;
  }
  &:-moz-placeholder { // Firefox 18-
    color: @color;
    font-weight: @font-weight;
  }
  &::-moz-placeholder { // Firefox 19+
    color: @color;
    font-weight: @font-weight;
  }
  &:-ms-input-placeholder {
    color: @color;
    font-weight: @font-weight;
  }
}

.select-wrapper(@background-color: white, @color: @cdap-header, @right: 10px) {
  background-color: @background-color;
  display: inline-block;
  position: relative;
  width: 100%;
  &:after {
    color: @color;
    content:"\f0d7";
    font-family:'FontAwesome';
    position: absolute;
    top: 25%;
    right: @right;
    z-index: 5;
  }
  select.form-control {
    background-color: transparent;
    padding-right: 20px;
    position: relative;
    z-index: 10;
    .appearance();
    color: @color;
  }
}
